<template>
  <div class="index">
    <div class="center">
      <left></left>
      <div class="right">
        <top></top>
        <div class="hei10"></div>
        <div class="where" style="background: #fff; padding: 10px 30px; font-size: 14px; color: #595959;">
          当前位置：
          <router-link to="/index" style="color: #409eff;">分销后台</router-link>>
          <router-link to="/yongjinzhichu" style="color: #409eff;">佣金支出</router-link>>
          待结算记录
        </div>

        <div class="hei10"></div>

        <div class="title">待结算记录</div>
        <div class="exportall" v-loading="loading" style="margin-top: 30px;">
          <div class="xiazaili" v-for="item in list" :key="item.id">
            <div  style=" background:#e9f0f7; padding:30px 20px;">
              <div class="flex" >
                <div style="margin-bottom: 0;">操作人：{{item.user_name}}</div>
                <div style="margin-bottom: 0;text-align: center;">生成时间：{{item.created_at}}</div>
                <div style="margin-bottom: 0;text-align: right;" v-if="item.status != -1">



                  <el-button type="primary" v-if="item.status == 20" size="mini" @click="xiazai3(item.expend_url)">下载数据</el-button>
                  <el-button type="primary" v-if="item.status == 30" disabled size="mini">导出数据为空</el-button>
                  <el-button type="primary" v-if="item.status == 0" :loading="true" size="mini" >数据生成中,请稍后刷新页面</el-button>
                  <el-button type="primary" v-if="item.status == 10" :loading="true" size="mini" >数据生成中,请稍后刷新页面</el-button>

                  <!-- <el-button type="primary" v-if="item.status == 2 && mingwen && item.cloud_filename" size="mini" @click="xiazai2(item.id)">下载明文数据</el-button> -->

                  <!-- <el-button type="primary" v-if="item.status == 2 && mingwen && item.cloud_filename == '' && item.type != 30" size="mini" @click="xiazaimingwen(item.id)">下载明文数据</el-button>
                  <el-button type="primary" v-if="item.status == 2 && mingwen && item.cloud_filename && item.type != 30" size="mini" @click="xiazaimingwen2(item.cloud_filename)">下载明文数据</el-button> -->


                </div>
              </div>
              <div style="margin-bottom: 0;" v-if="item.status == -1"><el-button type="text" size="mini">异常,联系技术解决</el-button></div>
            </div>
          </div>
        </div>
      </div>
    </div>

    <el-dialog title="输入条件导出生产" :visible.sync="log" width="30%" :close-on-click-modal="false">
      <div style="padding-right: 30px;">
        <el-form ref="form" @submit.native.prevent :model="form" label-width="150px">
          <el-form-item label="通过订单来源导出:">
            <el-input v-model="pro" :disabled="fixpronameshow" @input="searchproname" placeholder="输入订单来源"></el-input>
          </el-form-item>

          <el-form-item label="通过产品编码导出:">
            <el-input v-model="code" :disabled="fixprocodeshow" @input="searchprocode" placeholder="输入产品编码"></el-input>
          </el-form-item>
          <el-form-item label="查询结果:">
            {{fixpronames}}
          </el-form-item>
        </el-form>

      </div>
      <div slot="footer" class="dialog-footer">
        <el-button @click="log = false">取 消</el-button>
        <el-button type="primary" @click="daochu2()" :loading="daochuing">确 定</el-button>
      </div>
    </el-dialog>


    <el-dialog title="请输入导出密码" :visible.sync="mimalog" width="400px" :close-on-click-modal="false">
      <div style="padding-right: 30px;">
        <el-input v-model="mima" show-password placeholder="请输入导出密码"></el-input>
      </div>
      <div slot="footer" class="dialog-footer">
        <el-button size="medium" type="primary" v-if="this.daoorxia != 'dao22'" @click="mimaqueren">确 定</el-button>
        <el-button size="medium" type="primary" v-if="this.daoorxia == 'dao22'" @click="mimaqueren22">确 定</el-button>
        <el-button size="medium" type="text" @click="mimachongzhilog = true">重设密码</el-button>
      </div>
    </el-dialog>

    <el-dialog title="请设置导出密码" :visible.sync="mimasetlog" width="400px" :close-on-click-modal="false">
      <div style="padding-right: 30px; margin-bottom: 20px;">
        <el-input v-model="mimaset" show-password placeholder="请设置导出密码"></el-input>
      </div>
      <div style="padding-right: 30px;">
        <el-input v-model="mimaset2" show-password placeholder="请再次输入确认导出密码"></el-input>
      </div>
      <div style="color: #DF3434; margin-top: 10px;">为了您的订单数据安全，即日起所有批量导出数据的出口需输入导出密码才可导出，请与联系店铺负责人协商设置该密码</div>
      <div slot="footer" class="dialog-footer">
        <el-button size="medium" @click="mimasetlog = false">取 消</el-button>
        <el-button size="medium" type="primary" @click="mimasetqueren">确 定</el-button>
      </div>
    </el-dialog>

    <el-dialog title="重设密码" :visible.sync="mimachongzhilog" width="400px" :close-on-click-modal="false">
      <div style="padding-right: 30px; margin-bottom: 20px;">
        <el-input v-model="mimashoujihao" disabled placeholder="请输入验证码"></el-input>
      </div>
      <div style="padding-right: 30px; margin-bottom: 20px; position: relative;">
        <el-input v-model="mimacode" placeholder="请输入验证码"></el-input>
        <el-button style="padding: 9px 30px; position: absolute; right: 31px; top: 1px;" type="danger" @click="getcode"
          :disabled="jinyong" size="mini">{{tishi}}</el-button>
      </div>
      <div style="padding-right: 30px; margin-bottom: 20px;">
        <el-input v-model="mimaset" show-password placeholder="请输入新密码"></el-input>
      </div>
      <div style="padding-right: 30px;">
        <el-input v-model="mimaset2" show-password placeholder="请确认新密码"></el-input>
      </div>
      <div slot="footer" class="dialog-footer">
        <el-button size="medium" @click="mimachongzhilog = false">取 消</el-button>
        <el-button size="medium" type="primary" @click="mimaqueren2">确 定</el-button>
      </div>
    </el-dialog>

    <mima2 ref="mima2" @daochumima="daochumima" @guanbi="guanbi" v-if="mima2show"></mima2>
    <!-- <foot></foot> -->
  </div>
</template>

<script>
  import axios from "axios";
  import top from '@/components/top.vue'
  import left from '@/components/left.vue'
  import foot from '@/components/foot.vue'
  import mima2 from './Azujian/mima2.vue'
  export default {
    components: {
      "left": left,
      "top": top,
      "foot": foot,
      mima2
    },
    name: 'kanban',
    data() {
      return {

        msg: "hello",
        options: "",
        value: "",
        list: [],
        loading: true,
        url: "",
        everyday: '',
        prolist: "",
        pro: "",
        pros: 0,
        code: "",
        log: false,
        daochuing: false,
        daochuingz: "导出全部待生产",
        daochuingz2: "导出数据",
        lunxun: "",
        fixpronames: "",
        fixprocodeshow: false,
        fixpronameshow: false,
        form: {},
        fixproid: "",
        mimalog: false,
        mima: "",
        mimaid: "",
        mimasetlog: false,
        mimaset: "",
        mimaset2: "",
        mimachongzhilog: false,
        mimashoujihao: "",
        mimacode: "",
        count: 60,
        tishi: "获取验证码",
        jinyong: false,
        daoorxia: 'dao',
        dao: "",
        mingwen:false,

        mima2show:false,
        xiazaimingwenall:{
          id:"",
          pwd:""
        },
      }
    },
    created() {
      this.getpro()
      this.onelist();
      this.getshoujihao()

      //导出密码
      if (localStorage.getItem("daochumima") != null) {
        this.mima = localStorage.getItem("daochumima")
      }

      axios.get("/api/auth/me")
        .then(response=> {
          if(response.data.msg.code == 0){
            if(response.data.data.is_decrypt == 1){
              this.mingwen = true
            }
          }
        })
    },

    destroyed() {

    },
    methods: {

      guanbi:function(){
        this.mima2show = false
      },
      daochumima:function(mima){
        this.xiazaimingwenall.pwd = mima
        axios.post("/api/plan-market/order/export/dec", this.xiazaimingwenall)
            .then(response => {
              if (response.data.msg.code == 0) {
                this.mima2show = false
                this.getlist()
              } else {
                this.$message.error(response.data.msg.info);
              }
            })
      },
      //真下载
      xiazaimingwen2: function(dizhi) {
        var a = document.createElement('a');
        a.setAttribute('href', dizhi);
        a.click();
      },
      //假下载
      xiazaimingwen: function(id) {
        this.xiazaimingwenall = {
          id:id,
          pwd:""
        }
        this.mima2show = true
        this.$nextTick(()=>{
          this.$refs.mima2.mimalog = true
        })
      },

      xiazai2:function(id){
        axios.post("/api/plan-market/order/export/dec/new",{id: id})
          .then(response => {
            if (response.data.msg.code == 0) {
              var a = document.createElement('a');
              a.setAttribute('href',  window.location.origin + response.data.data.cloud_filename);
              a.click();
            } else {
              this.$message.error(response.data.msg.info);
            }
          })
      },
      xiazai3:function(expend_url){
        window.location = expend_url + '?attname='
        // axios.post("/api/plan-market/shop/log/url",{id: id})
        //   .then(response => {
        //     if (response.data.msg.code == 0) {
        //       var a = document.createElement('a');
        //       a.setAttribute('href',  window.location.origin + response.data.data.local_filename);
        //       a.click();
        //     } else {
        //       this.$message.error(response.data.msg.info);
        //     }
        //   })
      },
      //修改产品查询
      searchproname: function() {
        if (this.pro == "") {
          this.fixprocodeshow = false
          this.pros = 0
        } else {
          this.fixprocodeshow = true
          this.pros = 100
          this.fixproid = ""
        }
      },
      searchprocode: function() {
        if (this.code == "") {
          this.fixpronameshow = false
        } else {
          this.fixpronameshow = true
        }
        this.fixpronames = "查询中..."
        axios.get('/api/plan-market/product/get?sku=' + encodeURIComponent(this.code))
          .then(response => {
            if (response.data.msg.code != 0) {
              this.$message.error(response.data.msg.info);
            } else {
              if (response.data.data == null) {
                this.fixpronames = "没有查询到商品"
                this.fixproid = ""
              } else {
                this.fixpronames = response.data.data.name
                this.fixproid = response.data.data.id
              }
            }
          })
      },
      //轮询获取下载是否完成
      onelist: function() {
        this.getlist()
        this.loading = true
      },
      //获取所有产品
      getpro: function() {
        var that = this

        axios.get("/api/gth/products?_page_size=10000")
          .then(function(response) {
            that.prolist = response.data.data.data
          })
      },
      getlist: function() {
        var _url = '/api/plan-market/expend/pool/excel/get?page=1&page_size=1000&type=10'

        axios.get(_url)
          .then(response => {
            // for (let i in response.data.data.data) {

            //   response.data.data.data[i].remark = JSON.parse(response.data.data.data[i].remark)
            // }
            this.list = response.data.data.data

            this.loading = false
            // this.everyday = this.list[0].created_at
          })
      },
      //重置密码确认
      mimaqueren2: function() {
        if (this.mimaset != this.mimaset2) {
          this.$message.error("输入的密码不一致");
          return false
        }
        axios.post("/api/plan-market/shop/pwd", {
            mobile: this.mimashoujihao,
            sms_code: this.mimacode,
            password: this.mimaset
          })
          .then(response => {
            if (response.data.msg.code == 0) {
              this.$message.success("密码设置成功");
              this.mimachongzhilog = false
            } else {
              this.$message.error(response.data.msg.info);
            }
          })
      },
      //获取验证码
      getcode: function() {
        var that = this;
        var params = new URLSearchParams();
        params.append('mobile', this.mimashoujihao);
        axios.post('/api/auth/sms_code', params)
          .then(response => {
            if (response.data.msg.code == 0) {
              this.$message({
                message: '验证码已发送！',
                type: 'success'
              });
              that.daojishi()
            } else {
              this.$message.error(response.data.msg.info);
            }
          })
      },
      //倒计时功能
      daojishi: function() {
        var interval;
        interval = window.setInterval(() => {
          if (this.count <= 0) {
            window.clearInterval(interval)
            this.tishi = "获取验证码",
              this.jinyong = false
            this.count = 60
          } else {
            this.count -= 1;
            this.tishi = this.count + "秒重新获取"
            this.jinyong = true
          }
        }, 1000);
      },
      //获取手机号发验证码
      getshoujihao: function() {
        axios.get("/api/gth/my/shop/mobile")
          .then(response => {
            if (response.data.msg.code == 0) {
              this.mimashoujihao = response.data.data
            } else {
              this.$message.error(response.data.msg.info);
            }
          })
      },
      //密码设置
      mimasetqueren: function() {
        if (this.mimaset != this.mimaset2) {
          this.$message.error("输入的密码不一致");
          return false
        }

        axios.post("/api/plan-market/shop/pwd", {
            mobile: this.mimashoujihao,
            sms_code: this.mimacode,
            password: this.mimaset
          })
          .then(response => {
            if (response.data.msg.code == 0) {
              this.$message.success("密码设置成功");
              this.mimasetlog = false
            } else {
              this.$message.error(response.data.msg.info);
            }
          })
      },
      //确认密码下载
      mimaqueren: function() {
        var that = this
        if (this.daoorxia == "dao") {
          this.daochuing = true
          this.daochuingz = "生成数据中..."
          axios.post("/api/plan-market/order/export", {
              type: 2,
              password: this.mima
            })
            .then(function(response) {
              if (response.data.msg.code == 0) {
                that.$router.push({
                  path: '/order_export2'
                })
              } else {
                that.$message.error(response.data.msg.info);
                that.daochuing = false
                that.daochuingz = "导出全部待生产"
              }
            });
        } else {
          axios.post("/api/plan-market/shop/log/url", {
              id: this.mimaid,
              password: this.mima
            })
            .then(response => {
              if (response.data.msg.code == 0) {

                that.mimalog = false
                var a = document.createElement('a');

                a.setAttribute('href', response.data.data.local_filename);
                a.click();
              } else {
                this.$message.error(response.data.msg.info);
              }
            })
        }

      },

      xiazai: function(id) {
        this.mimaid = id
        this.daoorxia = 'xia'
        //判断有没有密码
        var that = this
        axios.get("/api/plan-market/shop/pwd")
          .then(function(response) {
            if (response.data.msg.code == 0) {

              if (response.data.data == "") {
                //要设置密码
                that.mimasetlog = true
              } else {
                //输入密码
                that.mimalog = true
              }
            } else {
              that.$message.error(response.data.msg.info);
            }
          });
      },
      daochu: function() {
        this.daoorxia = 'dao'
        var that = this
        axios.get("/api/plan-market/shop/pwd")
          .then(function(response) {
            if (response.data.msg.code == 0) {

              if (response.data.data == "") {
                //要设置密码
                that.mimasetlog = true
              } else {
                //输入密码
                that.mimalog = true
              }
            } else {
              that.$message.error(response.data.msg.info);
            }
          });
      },
      mimaqueren22: function() {
        if (this.pro == "" && this.code == "") {
          this.$message.error('至少选择一项！');
          return false
        }
        if (this.fixproid == "" && this.pros == 0) {
          this.$message.error('请先选择产品在导出！');
          return false
        }
        this.daochuing = true
        this.daochuingz2 = "生成数据中..."
        var that = this

        axios.post("/api/plan-market/order/export", {
            type: 2,
            sp_id: this.fixproid,
            source: this.pro,
            password: this.mima
          })
          .then(function(response) {
            if (response.data.msg.code == 0) {
              // that.loading = true
              // that.log = false
              // that.mimalog = false
              // that.getlist();
              // that.daochuingz2 = "导出数据"
              // that.daochuing = false
              //2021.3.1全部导出修改
              this.$router.push({
                path: '/order_export2'
              })
            } else {
              that.$message.error(response.data.msg.info);
              that.daochuingz2 = "导出数据"
              that.daochuing = false
            }
          });
      },
      daochu2: function() {

        this.daoorxia = 'dao22'
        var that = this
        axios.get("/api/plan-market/shop/pwd")
          .then(function(response) {
            if (response.data.msg.code == 0) {

              if (response.data.data == "") {
                //要设置密码
                that.mimasetlog = true
              } else {
                //输入密码
                that.mimalog = true
              }
            } else {
              that.$message.error(response.data.msg.info);
            }
          });



      }
    }
  }
</script>

<style lang="scss" scoped>
  .index {

    .flex {
      display: flex;
      align-items: center;
      justify-content: space-between;

      div {
        flex: 1;
        margin-bottom: 10px;
      }
    }

    .xiazaili {
      border: 1px #EAEAEA solid;
      margin-bottom: 20px;
      margin: 10px 20px;
      border: 1px #EAEAEA solid;
      border-radius: 6px;
      overflow: hidden;
      color: #666;
      font-size: 14px;
    }

    .title {
      line-height: 45px;
      padding-left: 30px;
      font-size: 16px;
      background: #eaeaea;
      color: #727272;
    }

    .my {
      display: flex;
      margin: 30px auto;

      .myid {
        font-size: 14px;
        color: #DD2727;
        padding-left: 10px;
        line-height: 30px;
        margin-right: 20px;
      }

    }

    .exportall {
      margin: 0 auto;
      border-right: 0;
      border-bottom: 0;

      .list {
        display: flex;
        text-align: center;
        border-bottom: 1px #EAEAEA solid;
        font-size: 14px;

        div {
          flex: 1;
          line-height: 45px;
          border-right: 1px #EAEAEA solid;
          color: #666;
        }
      }

      .l2 {
        font-size: 14px;
        color: #727272
      }
    }


  }
</style>
